<template>
  <el-dialog center  :title="title" :visible.sync="dialogFormVisible" :before-close="handleClose">
    <el-form :model="form" :rules="rules" ref="ruleForm">
      <el-form-item label="工作邮箱" prop="email_work">
        <el-input v-model="form.email_work" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="全职/兼职" prop="type" v-if="form.role_id == 2">
        <el-select v-model="form.type" placeholder="请选择">
          <el-option label="全职" value="全职"></el-option>
          <el-option label="兼职" value="兼职"></el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="handleClose">返回</el-button>
      <el-button type="primary" @click="submitForm('ruleForm')" v-no-more-click:3000>确 定</el-button>
    </div>
  </el-dialog>
</template>
<script>
import { getUserInfo, editUserInfo } from "~/api/user";
export default {
  data() {
    var checkEmail = (rule, value, callback) => {
      if (value === "" || value == undefined || value == null) {
        callback(new Error("请输入邮箱"));
      } else {
        if (
          !/^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/.test(
            value
          )
        ) {
          callback(new Error("请输入有效邮箱"));
        } else {
          callback();
        }
      }
    };
    return {
      dialogFormVisible: false,
      title: "修改代理人信息",
      form: {},
      rules: {
        email_work: [
          { required: true, validator: checkEmail, trigger: "blur" }
        ],
        type: [
          { required: true, message: "请输入全职或者兼职", trigger: "change" }
        ]
      }
    };
  },
  methods: {
    showDialog(typeId, userId) {
      this.dialogFormVisible = true;

      this.form.user = userId; //用户ID

      //代理人
      if (typeId == 2) {
        this.title = "编辑代理人";
        this.form.role_id = typeId;
      }
      //审核员
      if (typeId == 3) {
        this.title = "编辑审核员";
        this.form.role_id = typeId;
      }
      //流程人员
      if (typeId == 4) {
        this.title = "编辑流程人员";
        this.form.role_id = typeId;
      }
      if(typeId == 7) {
        this.title = "编辑子管理员";
        this.form.role_id = typeId;
      }
      //打开弹框时 获取用户详情
      this.getUserInfo();
    },

    // 获取用户详情
    getUserInfo() {
      getUserInfo(this.$axios, this.form.user)
        .then(res => {
          if (res.data.code == 200) {
            this.form = res.data.data;
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    submitForm(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          //没有修改用户名，不传递用户名
          var obj = {
            user: this.form.id,
            email_work: this.form.email_work
          };

          //代理人必填 兼职或全职
          if (this.form.role_id == 2) {
            obj["type"] = this.form.type;
          }
          editUserInfo(this.$axios, obj)
            .then(res => {
              if (res.data.code == 200) {
                this.$message({
                  message: "修改成功",
                  type: "success"
                });
                //调用代理人页面的刷新方法
                this.$emit("changeList");
                //清空重置
                this.resetForm("ruleForm");
              } else {
                this.$message({
                  message: res.data.message,
                  type: "error"
                });
              }
            })
            .catch(err => {
              this.$message({
                message: err,
                type: "error"
              });
              console.log(err);
            });
        } else {
          return false;
        }
      });
    },

    handleClose() {
      this.resetForm("ruleForm");
    },
    resetForm(formName) {
      this.dialogFormVisible = false;
      this.form = {};
      this.$refs[formName].resetFields();
    }
  }
};
</script>
<style>
</style>
